<template>
<div class="box">
	<Row v-for="(val,index) in bumens" :key="index" style="margin-bottom:10px;">
		<Col span="22">
			<Select v-model="bumens[index]" style="width:100%;">
				<Option value="">请选择</Option>
				<Option v-for="item in list" :value="item[field]" :key="item.id">{{ item.name }}</Option>
			</Select>
		</Col>
		<Col span="2" v-if="index!=0">
			<a @click="del(index)"><Icon type="ios-close-circle-outline" size="28" /></a>
		</Col>
	</Row>
	<div class="act_box">
		<a @click="add" title="添加一个"><Icon type="ios-add-circle-outline" size="28" /></a>
	</div>
</div>
</template>
<script>
export default {
	data:function(){
		return{
			bumens:[],
			list:[],
		};
	},
	props:{
		value:{
			default:[]
		},
		field:{
			default:'id'
		}
	},
	created:function(){

		this.bumens = this.value.split(',');
		
		
		this.load_data();
	},
	watch:{
		value(val){
			
			this.bumens = val.split(',');
		},
		bumens(val){
			var arr = [];
			for(var i=0;i<val.length;i++){
				if(val[i]!=''){
					arr.push(val[i]);
				}
			}
			this.$emit('input',arr.join(','));
		}
	},
	methods:{
		load_data(){
			var self = this;
			var postdata = {};
			
			Whttp.load('User/Bumen/get_all',postdata,function(result){
				self.list = result;
			});
		},
		add(){
			this.bumens.push('');
		},
		del(index){
			if(this.bumens.length<=1){
				alert('不能删除了');
				return;
			}
			this.bumens.splice(index,1);
		}
	}
}
</script>
<style scoped>
.box{position:relative;}
.act_box{
	position: relative;
}
.act_box a{color: #333;}
</style>